<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include  file="/common/jstl.jspf" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta charset="UTF-8">
		<title>注册界面</title>
		<link rel="stylesheet" href="${url }/css/common.css" />
		<link rel="stylesheet" href="${url }/css/register.css" />
		<link rel="Shortcut Icon" href="${url }/img/favicon.ico">
	</head>
  <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>
		<script src="${url }/js/register.js"></script>
	<body>
		<div class="login-top">
			<a href="${url }/index.jsp"><div class="logo"></div></a>
		</div>

		<div class="register-bottom">
			<div class="login-bottom-text">
				-专注互联网职业机会-
			</div>
		</div>

		<div class="register-main">
			<div class="register-main-left">
				<div class="register-main-left-top">
					<div id="phone">
						<div id="phone-img"></div>
					</div>
					<div id="email">
						<div id="email-img"></div>
					</div>
					<div class="tab-active" style="left: 150px"></div>
				</div>
				<div class="register-main-left-bottom1" id="phone-register" style="display:none;">
					<form action="register-success.html" method="get">
						<input type="text" id="Phone" style="width:290px;height:46px;outline-color: #00B38A; background: #F8F8F8;border-radius: 2%;font-size:14px;padding-left: 10px;border: none;" placeholder="请输入常用手机号码" autofocus="autofocus" />
						<sapn id="phoneTip"></sapn><br /><br />
						<input type="text" id="vetify" style="width:158px;height:46px; outline-color: #00B38A; background: #F8F8F8;border-radius: 2%;font-size:14px;padding-left: 10px;border: none;" placeholder="请证明你不是机器人" autofocus="autofocus" />
						<div class="verify">mypx</div>
						<div class="reload"><img src="img/register6.png" /></div><br />
						<span id="vetifyTip"></span><br />
						<input type="text" id="message" style="width:175px;height:46px; outline-color: #00B38A; background: #F8F8F8;border-radius: 2%;font-size:14px;padding-left: 10px;border: none;" placeholder="请输入短信验证码" autofocus="autofocus" />
						<div class="message-verify">获取验证码</div> <br />
						<span id="messageTip"></span><br />
						<input type="text" id="pw" style="width:290px;height:46px;outline-color: #00B38A; background: #F8F8F8;border-radius: 2%;font-size:14px;padding-left: 10px;border: none;" placeholder="请输入密码" autofocus="autofocus" /><br />
						<span id="passwordTip"></span><br />
						
						
						<input class="work select-border" type="radio" name="user.role_type" value="求职者">
						
						<input class="job" type="radio" name="user.role_type" value="公司">
						
						
						<div class="agree">
							<input type="checkbox" id="checkbox1" checked/>
							<label id="agree1" for="checkbox1">我已阅读并同意</label>
							<a href="" class="protocol">《拉勾用户协议》</a>
						</div><br /><br /><br /><br /><br />
						
						<a href="register-success.html"><input type="submit" value="注册" style="width:300px;height:46px;cursor: pointer; line-height: 46px;text-align: center;  background: #00B38A;color: white; border-radius: 2%;font-size:18px;letter-spacing:6px; padding-left: 10px;border: none;" />
						</a>
					</form>
				</div>
				<div class="register-main-left-bottom2" id="email-register" style="display: block;">
					<form action="${url }/user/user_register.action" method="post">
						<!--register-success.html  -->
						<input type="text" name="user.email" id="email" onmousemove="checkMail(this)" style="width:290px;height:46px;outline-color: #00B38A; background: #F8F8F8;border-radius: 2%;font-size:14px;padding-left: 10px;border: none;" placeholder="请输入常用邮箱地址" autofocus="autofocus" /><br />
						<sapn id="emailTip"></sapn><br />
						
						<input type="password" name="user.password" id="password1" onkeyup="checkpassword(this)" style="width:290px;height:46px; outline-color: #00B38A; background: #F8F8F8;border-radius: 2%;font-size:14px;padding-left: 10px;border: none;" placeholder="请输入密码" autofocus="autofocus" /><br />
						<span id="password1Tip"></span><br />
						
						<input  type="radio" name="user.role_type" checked="checked" value="1">求职者
						
						<input  type="radio" name="user.role_type" value="2">公司
						
						<div class="agree1">
							<input type="checkbox" id="checkbox" checked/>
							<label id="agree1" for="checkbox">我已阅读并同意</label>
							<a href="" class="protocol1">《拉勾用户协议》</a>
						</div><br /><br /><br /><br /><br />
						
						<!-- <a href="register-success.html"></a> -->
						<input id="mailrespsd" type="submit" value="注册" style="width:300px;height:46px;cursor: pointer; line-height: 46px;text-align: center;  background: #00B38A;color: white; border-radius: 2%;font-size:18px;letter-spacing:6px; padding-left: 10px;border: none;" />
						
					</form>
				</div>
			</div>

			<div class="register-main-center">
				<img src="${url }/img/register5.jpg" />
			</div>

			<div class="register-main-right">
				<span class="hot">已有拉勾账号：</span>
				<p>
					<a href="login.html">直接登录</a><span class="photo"><a href="login.html"><img src="img/login4.png" alt="" /></a></span></p><br /><br />
				<span class="p2">使用以下账号直接登录：</span>
				<div class="concern">
					<img src="${url }/img/login5.png" style="cursor: pointer;" />
					<img src="${url }/img/login6.png" style="cursor: pointer;" />
					<img src="${url }/img/login7.png" style="cursor: pointer;" />
				</div>

				<div class="two-dimensional-code">
					<img src="${url }/img/login2.jpg" style="width:124px;height:124px;cursor: pointer;" />
				</div>
				<p class="p1">[扫码下载拉钩APP]</p>
			</div>
		</div>
		
	</body>
<script type="text/javascript">

function checkpassword(obj){
	var psd=obj.value;
	var reg=/^[A-Za-z0-9]{6,18}$/;
	var id = obj.id;
	if(!reg.test(psd)){
		$("#password1Tip").html("您输入的密码不合法（由数字和字母组成且长度为6-18）");
		$("#password1Tip" ).css("color","red");
		$("#" + id ).focus();
		document.getElementById("mailrespsd").disabled=true;
		
	}else{
		$("#password1Tip").html("通过");
		$("#password1Tip" ).css("color","green");
		document.getElementById("mailrespsd").disabled=false;
	}
}
function checkMail(obj){
 var email=obj.value;
 var id = obj.id;
 var urlhttp="<%=request.getContextPath() %>/user/user_checkMail.action" ;
 var reg= /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
 if(!reg.test(email)){
	  
		$("#emailTip").html("您输入的邮箱不合法");
		$("#emailTip" ).css("color","red");
		$("#" + id ).focus();
		document.getElementById("mailrespsd").disabled=true;
 }else{
	 $.ajax({
		 type:'post',
	     data:{'user.email':email,
	            },
	     url:urlhttp,
	     dataType:'text',
	     success:function(data){
	    	 if(data=="ok"){
	    			$("#emailTip" ).html("该用户可以使用");
	    			$("#emailTip" ).css("color","green");
	    			document.getElementById("mailrespsd").disabled=false;
	    		}else{
	    			$("#emailTip").html(data+"请直接登陆或者到邮箱激活后使用");
	    			$("#emailTip" ).css("color","red");
	    			$("#" + id ).focus();
	    			document.getElementById("mailrespsd").disabled=true;
	    		}
	     }
	 });
	
 }
}
 

</script>
</html>
